<template>
  <div class="app navmo">
    <div class="cont1200">
      <div>
        <router-link to="/">
          <img class="logo"  src="@/assets/logo.png" alt />
        </router-link>
      </div>

      <div class="modCH">
        <!-- <ModesChoose></ModesChoose> -->
      </div>
      <img
        class="navmimg"
        src="https://qjsc.oss-cn-beijing.aliyuncs.com/images/system/config/mall_top_ad/mall_logo_right_da_image_0.jpg"
        alt
        srcset
      />
      <div class="searchBox">
        <input
          type="text"
          autocomplete="off"
          placeholder="请输入内容"
          class="el-input__inner searchinput"
        />
        <button class="el-button el-button--default searchButton">搜 索</button>
      </div>
      <div class="seralist">
        <ul>
          <li class="f-l" v-for="i in 6" :key="i">电动车 |</li>
        </ul>
      </div>
      <img
        class="navKfImg"
        src="https://qjsc.oss-cn-beijing.aliyuncs.com/images/system/config/mall_top_ad/mall_search_right_da_image_0.jpg"
        alt
        srcset
      />
    </div>
  </div>
</template>

<script type="text/ecmascript-6">
// import ModesChoose from "./ModelsChoose";
export default {
  data() {
    return {};
  },
  methods: {},
  components: {
    // ModesChoose
  }
};
</script>

<style lang="scss" type="text/css" scoped>
@import "../../common/style.scss";
.app {
  padding: 15px;
  background-color: white;
.seralist{
 position: absolute;
    top: 53px;
    z-index: 1;
    left: 380px;
    font-size: 12px;
    color: #666;
    li{
      margin-right: 1em;
      cursor: pointer;
    }
    li:hover{
      color: $main-color12;
    }
}
 
}
.navmo {
  .logo{
    width: 240px;
  }
  .navKfImg {
    position: absolute;
    top: -16px;
    left: 1035px;
  }
  .searchBox {
    position: absolute;
    top: 13px;
    left: 380px;
    width: 350px;
    .searchinput,
    .searchButton {
      border: 3px $main-color12 solid;
      border-radius: 0px;
    }
    .searchButton {
      position: absolute;
      top: 0px;
      border-radius: 0px;
      background-color: $main-color12;
      // line-height: 40px;
      color: white;
      padding: 10px;
    }

    .searchinput {
      width: 300px;
      padding-left: 15px;
      padding-right: 15px;
    }
  }
  .modCH {
    display: inline;
    position: absolute;
    top: 12px;
    left: 213px;
  }
  .cont1200 {
    height: 64px;
    position: relative;
  }
  .navmimg {
    position: absolute;
    top: -14px;
    left: 814px;
  }
}
</style>
